	$(function(){
		/*掷色子*/
	    var dice = $("#dice");
	    var dianji =$('.go');
	    var num =""
	    // 小人
		var ref;
		var i=0;
		var guijipoints = [];
        var index = 0;



        // 函数排队
        // 第一个函数走（色子）
        function fun1(){
   			$(".wrap").append("<div id='dice_mask'></div>");//加遮罩
	        dice.attr("class","dice");//清除上次动画后的点数
	        dice.css('cursor','default');
	        num = Math.floor(Math.random()*6+1);//产生随机数1-6
	        dice.animate({left: '+2px'}, 100,function(){
	            dice.addClass("dice_t");
	        }).delay(200).animate({top:'-2px'},100,function(){
	            dice.removeClass("dice_t").addClass("dice_s");
	        }).delay(200).animate({opacity: 'show'},600,function(){
	            dice.removeClass("dice_s").addClass("dice_e");
	        }).delay(100).animate({left:'-2px',top:'2px'},100,function(){
	            dice.removeClass("dice_e").addClass("dice_"+num);
	            $("#result").html("您掷得点数是<span>"+num+"</span>");
	            dice.css('cursor','pointer');
	            $("#dice_mask").remove();//移除遮罩
	            // 掷完色子后小人走动
	        });
		}
		 // 第二个函数走（小人）
		function fun2(){
			clearInterval(ref);
			clearInterval(bser);
			ref = setInterval(function(){
			    consoleLog();
			},100);
			var ps = [
                { x: 0, y: 300 }, 
                { x: 300, y:0 }, 
                { x:800, y:300 }
                ];
            guijipoints = CreateBezierPoints(ps, 1000);
            var moveobj = $("#move_div");
			var bser = setInterval(function () {
                var p = guijipoints[index];
                console.log(p.x);
                moveobj.css({ left: p.x, top: p.y });
                index++;
                if (index >= guijipoints.length) {
                     index = 0;
                }
            }, 1000 / 100);
            refs = setTimeout(function(){
				clearInterval(refs);
				clearInterval(bser);
				clearTimeout(ref);
			},3000);
            guijipoints.forEach(function (obj, i) {
                createDiv(obj.x, obj.y);
            });
		}
		// 排队时间控制
		dianji.click(function() {
		    $(":root").delay(0).queue(function(){
		        fun1();
		        $(this).dequeue()
		    });
		    $(":root").delay(2000).queue(function(){
		        fun2();
		        $(this).dequeue()
		    });
		});









	    // dianji.click(function(){
	    //     $(".wrap").append("<div id='dice_mask'></div>");//加遮罩
	    //     dice.attr("class","dice");//清除上次动画后的点数
	    //     dice.css('cursor','default');
	    //     num = Math.floor(Math.random()*6+1);//产生随机数1-6
	    //     dice.animate({left: '+2px'}, 100,function(){
	    //         dice.addClass("dice_t");
	    //     }).delay(200).animate({top:'-2px'},100,function(){
	    //         dice.removeClass("dice_t").addClass("dice_s");
	    //     }).delay(200).animate({opacity: 'show'},600,function(){
	    //         dice.removeClass("dice_s").addClass("dice_e");
	    //     }).delay(100).animate({left:'-2px',top:'2px'},100,function(){
	    //         dice.removeClass("dice_e").addClass("dice_"+num);
	    //         $("#result").html("您掷得点数是<span>"+num+"</span>");
	    //         dice.css('cursor','pointer');
	    //         $("#dice_mask").remove();//移除遮罩
	    //         // 掷完色子后小人走动
	    //     });
	    // });
	    //音乐播放
	    var audio = document.getElementById('mp3Btn');
		$('.audio_div').click(function(){
			//防止冒泡
			event.stopPropagation();
			if(audio.paused) //如果当前是暂停状态
			{
			$('.audio_div').css("background","url(images/music_on.png) no-repeat center bottom");
			$('.audio_div').css("background-size","cover");
			audio.play();//播放
			return;
			}
			//当前是播放状态
			$('.audio_div').css("background","url(images/music_off.png) no-repeat center bottom");
			$('.audio_div').css("background-size","cover");
			audio.pause(); //暂停
		});
		// 进度条
		$('#jqmeter-container').jQMeter({
		    goal:'1000',//进度条总长度(指的是进度)，必须的参数
		    raised:'900',//进度条当前进度，必须的参数
		    width:'80%',//显示的进度条的宽度
		    height:'20px',//显示的进度条的宽度
		    animationSpeed:2000,//进度条动画的时间
		    counterSpeed:3000,//进度条计数的时间
		});
		// 小人
		function consoleLog(){
			i++
			if(i<4){
				$('#box img').attr('src','images/'+i+'.png');
				$('#move1 img').attr('src','images/'+i+'.png');
			}else{
				i=0
			}
		}

		// 第二屏小人过桥
        $('.click').click(function(){
        	$('.click').css('display','none');
           clearInterval(ref);
			clearInterval(bser);
			ref = setInterval(function(){
			    consoleLog();
			},100);
			var ps = [
                { x: 0, y: 300 }, 
                { x: 300, y:0 }, 
                { x:800, y:300 }
                ];
            guijipoints = CreateBezierPoints(ps, 1000);
            var moveobj = $("#move1");
			var bser = setInterval(function () {
                var p = guijipoints[index];
                console.log(p.x);
                moveobj.css({ left: p.x, top: p.y });
                index++;
                if (index >= guijipoints.length) {
                     index = 0;
                }
            }, 1000 / 100);
            refs = setTimeout(function(){
				clearInterval(refs);
				clearInterval(bser);
				clearTimeout(ref);
				$('.begin').css('display','none');
				$('.box').css('display','block');
				guijipoints = [];
				index = 0;
			},7000);
            guijipoints.forEach(function (obj, i) {
                createDivs(obj.x, obj.y);
            });
        });
        function createDivs(x, y) {

            $("#begin").append('<div style="position: absolute; width: 2px; height: 2px; left:' + x + 'px;top:' + y + 'px; overflow: hidden; background-color: #FF0000"></div>');
        }

		// 点击开始行走
		// $('.go').click(function(){
		// 	clearInterval(ref);
		// 	clearInterval(bser);
		// 	ref = setInterval(function(){
		// 	    consoleLog();
		// 	},100);
		// 	var ps = [
  //               { x: 0, y: 300 }, 
  //               { x: 300, y:0 }, 
  //               { x:800, y:300 }
  //               ];
  //           guijipoints = CreateBezierPoints(ps, 1000);
  //           var moveobj = $("#move_div");
		// 	var bser = setInterval(function () {
  //               var p = guijipoints[index];
  //               console.log(p.x);
  //               moveobj.css({ left: p.x, top: p.y });
  //               index++;
  //               if (index >= guijipoints.length) {
  //                    index = 0;
  //               }
  //           }, 1000 / 100);
  //           refs = setTimeout(function(){
		// 		clearInterval(refs);
		// 		clearInterval(bser);
		// 		clearTimeout(ref);
		// 	},3000);
  //           guijipoints.forEach(function (obj, i) {
  //               createDiv(obj.x, obj.y);
  //           });
		// });
		// 贝塞尔曲线
        function createDiv(x, y) {
            $("#box").append('<div style="position: absolute; width: 2px; height: 2px; left:' + x + 'px;top:' + y + 'px; overflow: hidden; background-color: #FF0000"></div>');
        }
        //anchorpoints：贝塞尔基点
        //pointsAmount：生成的点数
        function CreateBezierPoints(anchorpoints, pointsAmount) {
            var points = [];
            for (var i = 0; i < pointsAmount; i++) {
                var point = MultiPointBezier(anchorpoints, i / pointsAmount);
                points.push(point);
            }
            return points;
        }
        function MultiPointBezier(points, t){
            var len = points.length;
            var x = 0, y = 0;
            var erxiangshi = function (start, end){
                var cs = 1, bcs = 1;
                while (end > 0) {
                    cs *= start;
                    bcs *= end;
                    start--;
                    end--;
                }
                return (cs / bcs);
            };
            for (var i = 0; i < len; i++) {
                var point = points[i];
                x += point.x * Math.pow((1 - t), (len - 1 - i)) * Math.pow(t, i) * (erxiangshi(len - 1, i));
                y += point.y * Math.pow((1 - t), (len - 1 - i)) * Math.pow(t, i) * (erxiangshi(len - 1, i));
            }
            return { x: x, y: y };
        }


        // 答题
        var jishu=0;




	});
	// 监控进度
	window.onload = function() {
		$('#jqmeter-container').jQMeter({
		    goal:'1000',//进度条总长度(指的是进度)，必须的参数
		    raised:'1000',//进度条当前进度，必须的参数
		    width:'80%',//显示的进度条的宽度
		    height:'20px',//显示的进度条的宽度
		    animationSpeed:2000,//进度条动画的时间
		    counterSpeed:3000,//进度条计数的时间
		});
		$('.therm span').on('DOMNodeInserted',function() {
			if($('.therm span').text()=="100%"){
				$('.dyp').css('display','none');
				$('.begin').css('display','block');
			}
		})
	}


 


